<template>
  <view class="page-container">
    <u-navbar :is-back="false" title="地产服务" title-color="#FFF" :background="{
					background: '#00a0e9',
				}">
    </u-navbar>
    <view class="content">
      <view class="card">
        运行服务
      </view>
      <view class="grid-view">
        <view class="grid-item" @click="addWfTask('2c9110d177c344660177eb51955101bd')">
          <view class="icon">
            <image src="@/static/images/jhsb.png"></image>
          </view>
          <view class="label">计划上报</view>
        </view>
        <view class="grid-item" @click="routeTo({
                      link:'tasklist',
                      params:{
                        wfid:'2c9110d177c344660177ccea886b1354',
                        title:'领箱反馈'
                      }})">
          <view class="icon">
            <image src="@/static/images/lxfk.png"></image>
          </view>
          <view class="label">领箱反馈</view>
        </view>
        <view class="grid-item" @click="routeTo({
                      link:'tasklist',
                      params:{
                        wfid:'2c9110d177c344660177cd8e1b071b07',
                        title:'返空上报'
                      }})">
          <view class="icon">
            <image src="@/static/images/fksb.png"></image>
          </view>
          <view class="label">返空上报</view>
        </view>
        <view class="grid-item" @click="routeTo({
                      link:'tasklist',
                      params:{
                        wfid:'2c9110d177c344660177fbc15b6b5233',
                        title:'商务确认'
                      }})">
          <view class="icon">
            <image src="@/static/images/swqr.png"></image>
          </view>
          <view class="label">商务确认</view>
        </view>
      </view>
    </view>
    <tabbar></tabbar>
  </view>
</template>

<script>
import tabbar from '../../components/tabbar.vue'

export default {
  components: {
    tabbar
  },
  data() {
    return {};
  },
  methods:{
    addWfTask(flowId){
      uni.showLoading({
        title: '新建任务中',
        mask: true,
      })
      uni.showNavigationBarLoading();
      this.api.addWfTask({flowId:flowId}).then(data=>{
        uni.hideLoading();
        uni.hideNavigationBarLoading();
        console.log(data,"新建流程结果");
        if(data.code==0){
          if(data.data.msg == ""){
            this.routeTo({
              link:'approve',
              params:{
                id:data.data.taskId,
                openStatus:8,
                title:'计划上报'
              }
            })
          }else{
            uni.showModal({
              title: '提示',
              content: data.data.msg,
              showCancel: false,
              success: function (res) {

              }
            })
          }
        }else{
          uni.showModal({
            title: '提示',
            content: data.msg,
            showCancel: false,
            success: function (res) {

            }
          })
        }

      })
    },
  }

}
</script>

<style lang="less">

.page-container {
  .content {
    background: #f0f0f0;
    flex: 1;
    padding: 20rpx;

    .card {
      background: #FFF;
      border-radius: 10rpx;
      font-weight: 600;
      padding: 20rpx 40rpx;
      font-size: 34rpx;
    }


    .grid-view {
      margin-top: 20rpx;
      background: #FFF;
      border-radius: 10rpx;
      display: grid;
      grid-template-columns: repeat(3, 33.333%);

      .grid-item {
        padding: 30rpx 0;
        text-align: center;
        align-items: center;
        justify-content: center;

        .icon {
          width: 120rpx;
          height: 120rpx;
          margin: 0 auto 10rpx;

          image {
            width: 100%;
            height: 100%;
          }
        }

        .label {
          font-size: 28rpx;
        }
      }
    }
  }
}
</style>
